import axios, { AxiosRequestConfig } from 'axios'
import type { ApiRes } from '@/types/data'
import { store } from '@/store'
import { setUserInfo } from '@/store/modules/user'
import { User } from '@/types/user'
import router from '@/router'

// 这个实例就在该文件中使用，不要像之前一样导出去了
// 到时候我们下面单独导出一个函数
const instance = axios.create({
  baseURL: import.meta.env.VITE_BASEURL
})

// 请求拦截器
instance.interceptors.request.use(
  function (config) {
    // 在发送请求之前做些什么
    // 获取token，如果有token则携带
    if (store.getState().user.token) {
      config.headers.token = store.getState().user.token
    }

    return config
  },
  function (error) {
    // 对请求错误做些什么
    return Promise.reject(error)
  }
)

// 响应拦截器
instance.interceptors.response.use(
  function (response) {
    if (response.data.code === 206) {
      // 清空token
      store.dispatch(setUserInfo({} as User))

      // 跳转到登录页面，并且携带重定向的页面
      if (router.state.location.pathname !== '/login') {
        router.navigate(`/login?redirect=${router.state.location.pathname}`)
      }
    }
    // 返回响应体数据
    return response.data
  },
  function (error) {
    return Promise.reject(error)
  }
)

/**
 * 这里的T 是 {code:200,message:"请求成功",data: T}

 *  ApiRes<T> ===> 展开就是 {code:200,message:"请求成功",data: T}
 */
export const request = <T>({
  url,
  method = 'GET',
  data
}: AxiosRequestConfig) => {
  /**
   * instance的第二个参数，就是服务器返回的响应体数据
   */
  return instance<any, ApiRes<T>>({
    url,
    method,
    [method?.toLowerCase() === 'get' ? 'params' : 'data']: data
  })
}
